<style lang='scss' type='stylesheet/scss' scoped>
.as-button {
  margin-bottom: 10px;
}
</style>
<template>
  <div>
    <as-h2>button-group</as-h2>

    <as-card :text="text"
             title="嵌套在 button 外层，形成一个组列。可设置 size disabled。">
      <as-button-group disabled="disabled">
        <as-button type="primary">移动</as-button>
        <as-button type="primary">复制</as-button>
        <as-button type="danger">删除</as-button>
      </as-button-group>
      <div></div>
      <as-button-group size="small">
        <as-button type="primary">移动</as-button>
        <as-button type="primary">复制</as-button>
        <as-button type="danger">删除</as-button>
      </as-button-group>
      <div></div>
      <as-button-group size="mini">
        <as-button type="primary">移动</as-button>
        <as-button type="primary">复制</as-button>
        <as-button type="danger">删除</as-button>
      </as-button-group>
    </as-card>
  </div>
</template>

<script type="text/ecmascript-6">
export default {
  name: "",
  data() {
    return {
      text: `<template>
   <div>
     <as-button-group disabled="disabled">
       <as-button type="primary">移动</as-button>
       <as-button type="primary">复制</as-button>
       <as-button type="danger">删除</as-button>
     </as-button-group>
     <div></div>
     <as-button-group size="small">
       <as-button type="primary">移动</as-button>
       <as-button type="primary">复制</as-button>
       <as-button type="danger">删除</as-button>
     </as-button-group>
     <div></div>
     <as-button-group size="mini">
       <as-button type="primary">移动</as-button>
       <as-button type="primary">复制</as-button>
       <as-button type="danger">删除</as-button>
     </as-button-group>
   </div>
 </template>`
    };
  }
};
</script>
